<template>
  <!-- 报道指南页面 -->
  <view class='reports_guide'>
    <!-- <image
    class="head_img"
      style="width: 100%;height: 130px;background: #fff;"
      src="../../../static/index/liyuanzhinan.png"
    /> -->
    <view class="head_img"></view>
    <view class="guide_box">
      <view
        class="guide_txt1"
        v-for="(item) in guideData"
        :key="item.id"
        @tap='clickGuide(item)'
      >
        <view class="guide_img">
          <image
            style="width: 48px;height: 48px;border-radius: 50%;"
            :src="getImgUrl(item['image_id.download_url'])"
          />
        </view>
        <view class="guide_data">
          <view
            class="txt1"
            type="default"
          >
            <text class="t1">{{item.name}}</text>
            <nut-icon
              name="right"
              class="t2"
              v-show="!(item.id === 4 || item.id === 16 || item.id === 17)"
            ></nut-icon>
          </view>
          <view class="li1">
            <block
              v-for="i in item.data2"
              :key="i.$index"
            >
              <view
                v-show="i.type === 'text'"
                v-html="i.text"
              ></view>
              <view style="font-weight: bold;color:#000"
                v-show="i.type === 'phone'"
                @click.stop="call(i.text)"
              >{{i.text}}</view>
            </block>
          </view>
          <!-- <view class="li1"  v-html="item.description"></view> -->
        </view>
      </view>
    </view>
  </view>
</template>
<script>
import './guide.less'
import Taro, { useRouter, getCurrentInstance } from '@tarojs/taro'
export default {
  data() {
    return {
      guideData: [],
    }
  },
  mounted() {
    this.getGuideData();
  },
  methods: {
    // 图片路径
    getImgUrl(url) {
      return this.$mConfig.assetsPath + url;
    },
    call(phone) {
      console.log("电话", phone);
      Taro.makePhoneCall({
        phoneNumber: phone //仅为示例，并非真实的电话号码
      })
    },
    // 跳转
    clickGuide(item) {
      if (item.id === 4 || item.id === 16 || item.id === 17) {
        return
      }
      Taro.navigateTo({
        url: `/pages/activity/guide/articleDetail?id=${item.id}&type=${item.id}`
      })
    },
    // 请求数据
    getGuideData() {
      let that = this
      that.flora.dash.dataApi.search({
        vars: {
          fields: ['id', 'name', 'description', 'sequence', 'image_id.download_url'],
          model: 'FreshProcessSettings',
          condition: {
            logic_operator: '&',
            children: [
              {
                leaf: {
                  field: 'is_show',
                  comparator: '=',
                  value: true,
                }
              },
            ]
          },
          sort: [
            {
              field: "sequence",
              order: "asc"
            }
          ],
          offset: 0
        },
        cacheMode: 'no-cache',
      }).then((r) => {
        // console.log("报道指南数据==>", r.result.items)
        //使用数据源
        const str = [];
        (r?.result?.items || []).forEach((row) => {
          if (row?.data) {
            const item = row?.data;
            item.description = item.description.replace(/&nbsp;/g, '\xa0')
            item.data2 = that.parseStr(item.description);
            // console.log("报道指南数据item==>",item)
            str.push(item);

          }
        })
        //打印获取的数据源
        console.log("报道指南数据==>", str)
        this.guideData = str;
      })

    },

    parseStr(str) {
      // const regPhone = /(1\d{10})/
      const regPhone = /(1\d{10})|(\d{4}-\d{8}|\d{3}-\d{8})/;
      const list = str.split(regPhone);
      const result = []
      return list.map(c => {
        let tag
        regPhone.test(c) ? tag = 'phone' : tag = 'text'
        return {
          type: tag,
          text: c
        }
      })
    }


    //   canFormat(_index,_html){
    //   //检测需要替换的字符串是否在'A'、'IMG'、'FRAME'里面，或者在元素的属性值里面
    //   let _body=document.getElementsByTagName('body')[0]
    //   let _div=document.createElement('div')
    //   _div.innerHTML=_html.slice(0, _index) + '<i id="detectItem"></i>' + _html.slice(_index);
    //   _body.appendChild(_div)
    //   if(!document.getElementById('detectItem')) {
    //     //需要替换的字符串在元素的属性值里面
    //     _div.remove()
    //     return false
    //   }
    //   let _tagName=document.getElementById('detectItem').parentNode.tagName
    //   _div.remove()
    //   if(_tagName=='A'||_tagName=='IMG'||_tagName=='FRAME'){
    //     //需要替换的字符串在'A'、'IMG'、'FRAME'里面 
    //     return false
    //   }else{
    //     return true
    //   }
    // }

  }
}
</script>
<style>
</style>